
<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column type="index" :index="indexMethod" width="50"></el-table-column>
    <el-table-column prop="authName" label="权限名称" width="180"></el-table-column>
    <el-table-column prop="path" label="路径" width="180"></el-table-column>
    <el-table-column  label="等级">
      <template slot-scope="scope">
        <span v-if="scope.row.level==0">一级</span>
        <span v-else-if="scope.row.level==1">二级</span>
        <span v-else>三级</span>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data () {
    return {
      tableData: [
        {
          authName: '订单管理',
          path: 'order',
          level: '1'
        }
      ]
    }
  },
  async created () {
    const res = await this.$axios.get('/rights/list')
    console.log(res.data.data)
    this.tableData = res.data.data
  },
  methods: {
    /**
     * 处理索引 从 0 开始
     *
     */
    indexMethod (index) {
      // 1. 在 索引标签里面, :index='indexMethod'
      // 2. indexMethod 里接收的形参,就是从索引传过来的,而且还是从0开始的
      // 3. 返回去就可以了
      return index
    }
    /**
     * 0 : 一级
     * 1 : 二级
     * 2 : 三级
     */
  }
}
</script>

<style>
</style>
